<!--author:王佳欣-->
<!DOCTYPE html>
<html lang="en">
<head>
    <script src="js/jquery.min.js"></script>
    <meta charset="UTF-8">
    <title>用户详细信息</title>
    <meta name="description" content="Charcoal is a free Bootstrap 4 UI kit build by @attacomsian at Wired Dots."/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!--Bootstrap 4-->
    <link rel="stylesheet" href="css/bootstrap.css">
    <style>
        .dropbtn {
            background-color: transparent;
            color: white;
            padding-left: 35px;
            padding-right: 35px;
            font-size: 16px;
            border: none;
            cursor: pointer;
        }
        .dropdown {
            position: relative;
            display: inline-block;text-align: center;
        }
        .dropdown-content {
            display: none;
            position: absolute;
            background-color: #f9f9f9;
            width: 100%;;
            box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
        }
        .dropdown-content a {
            color: black;
            padding: 12px 16px;
            text-decoration: none;
            display: block;
        }
        .dropdown-content a:hover {
            background-color: #f1f1f1
        }
        .dropdown:hover .dropdown-content {
            display: block;
        }
        .dropdown:hover .dropbtn {
            background-color: transparent;
        }
        /*导航栏样式*/
        /*导航栏样式*/
        .navbar {
            background-color: #222;
        }
        #daohang {
            list-style-type: none;
            margin: 0;
            padding: 0;
            overflow: hidden;
            background-color: transparent;
        }
        li {
            height: 40px;
            padding-left: 0;
            padding-right: 20px;
            font-size: 15px;
            float: left;
        }
        li a {
            padding: 10px;
            display: block;
            color: white;
            text-align: center;
            /*padding: 14px 16px;*/
            text-decoration: none;
        }
        /*!*鼠标移动到选项上修改背景颜色 *!*/
        li a:hover {
            background-color: #111;
        }
        .active {
            background-color: black;
        }
        .col-sm-detail {
            box-shadow: 10px 10px rgba(206, 204, 204, 0.47);
            background-color: white;
            border-radius: 15px;
            -ms-flex: 0 0 100%;
            flex: 0 0 100%;
            max-width: 100%; }
    </style>
</head>
<body>
<nav class="navbar navbar-expand-md navbar-dark fixed-top sticky-navigation">
    <a class="navbar-brand font-weight-bold" href="index.html">别叫我OJ</a>
    <ul id="daohang">
        <li>
            <div id="index" align="right">
                <a style="color: white" href="index.html">首页</a>
            </div>
        </li>
        <li>
            <div id="remind" align="right">
                <a style="color: white" href="questionbank.html">题库</a>
            </div>
        </li>
        <li>
            <div id="rank" align="right">
                <a style="color: white" href="rank.html">排名</a>
            </div>
        </li>
        <li>
            <div class="active" id="userDetail" align="right">
                <a style="color: white" href="userDetail.html">个人中心</a>
            </div>
        </li>
        <li>
            <div id="ai" align="right">
                <a style="color: white" href="ai.html">Ai聊天</a>
            </div>
        </li>
    </ul>
    <div class="collapse navbar-collapse" id="topMenu">
        <ul class="navbar-nav ml-auto">
            <div style="margin:5px" id="javaoj">
                <span style="margin-right: 20px;color: white">欢迎！<a id="huanying" href="userDetail.html"></a></span>
                <a style="color: white" href="login.html" onclick="logout()"> 退出登录</a>
                <div class="dropdown">
                    <button class="dropbtn">设置</button>
                    <div class="dropdown-content">
                        <a href="updateInfo.html">修改个人信息</a>
                        <a href="updatePassword.html">修改密码</a>
                    </div>
                </div>
            </div>
        </ul>
    </div>
</nav>
<div id="detail" style="width: 800px;height: 600px;margin: 0 auto">
    <h3 style="padding: 100px;text-align: center">个人信息</h3>
    <div style="width: 500px;margin: 0 auto" class="col-sm-detail">
        <div style="padding-bottom: 20px">
            <p style="display: inline-block;width: 130px;font-size: 23px;margin-left: 20px;margin-top: 20px">学号</p>
            <p id="id" style="display: inline;font-size: 23px"></p>
        </div>
        <div style="padding-bottom: 20px">
            <p style="display: inline-block;width: 130px;font-size: 23px;margin-left: 20px;">用户名</p>
            <p id="username" style="display: inline;font-size: 20px"></p>
        </div>
        <div style="padding-bottom: 20px;">
            <p style="display: inline-block;width: 130px;font-size: 23px;margin-left: 20px;">性别</p>
            <p id="gender" style="display: inline;font-size: 23px"></p>
        </div>
        <div style="padding-bottom: 20px">
            <p style="display: inline-block;width: 130px;font-size: 23px;margin-left: 20px;">ac题数</p>
            <p id="ac_count" style="display: inline;font-size: 23px"></p>
        </div>
    </div>

</div>
<!--footer-->
<section class="py-5 bg-dark">
    <div class="container">
        <div class="row">
            <div class="col-md-6 offset-md-3 col-sm-8 offset-sm-2 col-xs-12 text-center">
                <p class="pt-2 text-muted">
                    &copy; by <a href="aboutUs.html" target="_blank">别叫我们组</a>
                </p>

            </div>
        </div>
    </div>
</section>

<script type="text/javascript">
    //从session中获取所需要的值
    var userId= localStorage.getItem("userId");
    var password = localStorage.getItem("password");
    var name=localStorage.getItem("username");
    let huanying = document.getElementById("huanying");
    getName();
    function getName(){
        if(isEmpty(name)){
            huanying.innerText=userId;
        }else{
            huanying.innerText= name;
        }
    }
    //获取用户登录信息，获取失败则返回登录页面
    function getUser(){
        if (userId==null){
            location.assign("login.html");
        }
    }
    function logout(){
        localStorage.clear();
    }
    // getUser();

    let id = document.getElementById("id");
    let username = document.getElementById("username");
    let gender = document.getElementById("gender");
    let acCount = document.getElementById("ac_count");
    function getUserDetail(){
        $.ajax({
            url:"http://192.168.2.5:8010/user/findUserById/"+userId,
            success:function (result){
                id.innerText=result.data.id;
                var name = result.data.username;
                if (isEmpty(name)){
                    username.innerText = "您还没有设置用户名，请前往设置完善";
                    username.style.color="#0d71bb";
                }else{
                    username.innerText=name;
                }
                if (result.data.gender=="M"){
                    gender.innerText="男";
                }else{
                    gender.innerText="女";
                }
                acCount.innerText=result.data.acCount;
            }
        })
    }
    getUserDetail();

    function isEmpty(name) {
        if(name === '' || name.trim().length === 0){
            return true;
        }else{
            return false;
        }
    }
    getAdmin();
    function getAdmin(){
        console.log(userId);
        console.log(password);
        let user={
            "id" : userId.valueOf(),
            "password" : password.valueOf(),
        };
        $.ajax({
            url:"http://192.168.2.5:8010/admin/login?id="+user.id+"&password="+user.password,
            type:"GET",
            success: function (data) {
                let msg=data.msg;
                if(msg==="登录成功") {
                    console.error("管理员yyds");
                    isAdminUser();
                }
            }
        })
    }function isAdminUser(){
        // Create the new <li> element
        const newListItem = document.createElement('li');

        // Create the new <div> element
        const newDiv = document.createElement('div');
        newDiv.style.marginLeft = '20px';
        newDiv.id = 'manager';
        newDiv.align = 'right';

        // Create the new <a> element
        const newLink = document.createElement('a');
        newLink.style.color = 'white';
        newLink.href = 'manager.html';
        newLink.textContent = '管理员中心';

        // Append the <a> element to the <div> element

        newDiv.appendChild(newLink);
        // Append the <div> element to the <li> element
        newListItem.appendChild(newDiv);

        // Append the new <li> element to the existing <ul> element
        const navigationList = document.getElementById('daohang');
        navigationList.appendChild(newListItem);

    }
</script>

</body>
</html>